<template>
	<view class="datum" style="height: 100%;background-color: #fff;">
		<view class="head">
			<view class="datum-csd" style="display: flex;" >
				<view style="flex: 1;padding-top: 15px;">
					<image :src="avatar == '' || avatar == undefined ? '/static/default_avatar.png' : avatar" class="inimage" />
				</view>
				<view style="flex: 1;text-align: right;">
					<view style="; color: #B9B9B9;margin-right: 10px;line-height: 54px;">修改头像</view>
				</view>
			</view>

			<!-- <view class="issue">账户</view> -->
			<view class="issue">
				<view>手机号</view>
				<view style="font-size: 12px;margin-top: 5px;">{{mobile_number == '' ? '未设置' : mobile_number}}</view>
			</view>
			<view class="issue">
				<view>昵称</view>
				<view style="font-size: 12px;margin-top: 5px;">{{username == '' ? '未设置' : username}}</view>
			</view>
			<!-- <view class="issue">个人简介</view> -->
			<navigator url="/pages/user/address">
				<view class="issue">
					<view>收货地址</view>
					<view style="font-size: 12px;height: 5px;"></view>
				</view>
			</navigator>
			<view class="issue">
				<view>修改密码</view>
				<view style="font-size: 12px;height: 5px;"></view>
			</view>
		</view>
		<!-- <button style="margin: 30px 10px; background-color: red; color: #FFFFFF; font-size: 12px; padding: 5px 0;">退出登录</button> -->

	</view>
</template>

<script>
	export default {
		data() {
			return {
				avatar: '',
				mobile_number: '',
				username: '',
			}
		},
		onLoad() {
			this.avatar = this.$common.getUserInfo('avatar');
			this.username = this.$common.getUserInfo('username');
			this.mobile_number = this.$common.getUserInfo('mobile_number');
		},
		methods: {

		}
	}
</script>

<style>
	.head {
		font-size: 14px;
	}

	.inimage {
		width: 50px;
		height: 50px;
		border-radius: 50px;
		margin-left: 20px;
	}

	.issue {
		font-size: 14px;
		padding: 15px 15px 5px 15px;
		border-bottom: 1px solid #E4E7ED;
	}

</style>
